{% extends 'cms/cms_base.html' %}
{% block title -%}
    CMS用户管理
{%- endblock %}

{% block page_title -%}
    {{ self.title() }}
{%- endblock %}

{% block head -%}
    <script src="{{ static('cms/js/cuser.js') }}"></script>
    <style>
        .top-box button{
            float: right;
        }
    </style>
{%- endblock %}

{% block main_content -%}
    <div class="top-box">
        <button class="btn btn-warning" data-toggle="modal" data-target="#myModal">添加CMS用户</button>
    </div>
    <table class="table table-bordered">
        <thead>
            <tr>
                <td>用户名</td>
                <td>邮箱</td>
                <td>加入时间</td>
                <td>当前状态</td>
                <td>权限</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
        {% for cuser in cusers %}
            <tr data-user-id="{{ cuser.id }}" data-role-name="{{ cuser.roles[0].name }}" data-status="{{ 1 if cuser.current_status else 0 }}">
                <td>{{ cuser.username }}</td>
                <td>{{ cuser.email }}</td>
                <td>{{ cuser.join_time }}</td>
                <td>
                    {% if cuser.current_status %}
                        <label class="label label-success">正常</label>
                    {% else %}
                        <label class="label label-danger">已被封号</label>
                    {% endif %}
                </td>
                <td>
                    {% for role in cuser.roles %}
                        <input type="hidden" value="{{ role.id }}">
                        {{ role.name }}
                        {% if not loop.last %}，{% endif %}
                    {% endfor %}</td>
                <td>
                {% if cuser.email == g.cms_user.email %}
                    <label class="label label-danger">当前用户不能操作</label>
                {% else %}
                    <button class="btn btn-default btn-xs edit-auth-btn">修改</button>
                    {% if cuser.current_status %}
                        <button class="btn btn-danger btn-xs move-blackList">移入黑名单</button>
                    {% else %}
                        <button class="btn btn-danger btn-xs move-blackList">取消黑名单</button>
                    {% endif %}
                {% endif %}
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>

    <!-- 添加cms用户的模态框 -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">输入用户信息</h4>
                </div>
                <div class="modal-body">
                    <form action="" class="form-horizontal">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">姓名</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="username" placeholder="请填写用户的真实姓名,确认后不能修改">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">邮箱</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="email" placeholder="邮箱，用户登录账号">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">默认密码</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="password" readonly="readonly" value="123456" placeholder="密码">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">权限</label>
                            <div class="col-sm-10">
                                <select name="role_id" class="form-control">
                                    {% for role in roles %}
                                        <option value="{{ role.id }}">{{ role.name }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" id="save-cuser-btn" class="btn btn-primary">保存</button>
                </div>
            </div>
        </div>
    </div>
    <!-- end -->
{%- endblock %}